<extend name="Public/layout"/>

<block name="header">
    <div class="header">
        <div class="container">
            <ul class="breadcrumb">
                <li><i class="icon-location-arrow"></i></li>
                <li><a href="__ROOT__/">首页</a></li>
                <li><a href="__ROOT__/">密码重置</a></li>
            </ul>
         </div>
    </div>
</block>

<block name="body">
    <div class="container">
        <div class="row">
            <div class="login col-xs-12 col-md-5">
                <div class="login box">
                    <ul class="nav-tabs nav">
                        <li data-tab="reg1" class="active"><a href="#reg1" data-toggle="tab">通过邮箱重置</a></li>
                        <li data-tab="reg2"><a href="#reg2" data-toggle="tab">通过手机重置</a></li>
                    </ul>
                    <div class="tab-content">
                        <div id="reg1" class='tab-pane active'>
                            <form action="__SELF__" method="post" class="reg-form-email">
                                <div class="form-group">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="icon-envelope"></i></span>
                                        <input type="text" class="form-control" name="email" placeholder="请输入邮箱">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="icon-repeat"></i></span>
                                        <input type="text" class="form-control" name="verify" placeholder="请输入验证码">
                                        <span class="input-group-btn">
                                            <button type="button" class="btn btn-primary submit send-mail-verify">发送邮件验证码</button>
                                        </span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="icon-key"></i></span>
                                        <input type="text" class="form-control" name="password" placeholder="请输入新密码">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <input type="hidden" name="reg_type" value="email">
                                    <button class="btn btn-primary submit ajax-post"  type="submit" target-form="reg-form-email">重置密码</button>
                                </div>
                            </form>
                        </div>
                        <div id="reg2" class='tab-pane'>
                            <form action="__SELF__" method="post" class="reg-form-mobile">
                                <div class="form-group">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="icon-tablet"></i></span>
                                        <input type="text" class="form-control" name="mobile" placeholder="请输入手机号">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="icon-repeat"></i></span>
                                        <input type="text" class="form-control" name="verify" placeholder="请输入验证码">
                                        <span class="input-group-btn">
                                            <button type="button" class="btn btn-primary submit send-mobile-verify">发送短信验证码</button>
                                        </span>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="icon-key"></i></span>
                                        <input type="text" class="form-control" name="password" placeholder="请输入新密码">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <input type="hidden" name="reg_type" value="mobile">
                                    <button class="btn btn-primary submit ajax-post"  type="submit" target-form="reg-form-mobile">重置密码</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</block>

<block name="script">
    <script type="text/javascript">
        var wait = 30;
        function time(that){
            if(wait == 0){
                $(that).removeClass('disabled').prop('disabled',false);
                $(that).html('重新发送验证码');
            }else{
                $(that).html(wait+'秒后重新发送');
                wait--;
                setTimeout(function(){
                    time(that);
                },1000);
            }
        }

        $(function(){
            $('.send-mail-verify').click(function(){
                var url;
                var that = this;
                if(url = "{:U('User/SendMailVerify')}"){
                    var email = $('input[name="email"]').val();
                    var filter  = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
                    if(!filter.test(email)){
                        alertMessager('邮箱账号不正确', 'danger');
                    }else{
                        $(that).addClass('disabled').prop('disabled', true);
                        wait = 30;
                        time(that);
                        $.post(url,{'email':email, 'title':'密码重置'}).success(function(data){
                            message = data.info;
                            if(data.status == 1){
                                alertMessager(data.info, 'success');
                            }else{
                                alertMessager(data.info, 'danger');
                            }
                        });
                    }
                }
                return false;
            });

            $('.send-mobile-verify').click(function(){
                var url;
                var that = this;
                if(url = "{:U('User/sendMobileVerify')}"){
                    var mobile = $('input[name="mobile"]').val();
                    var filter  = /^1\d{10}$/;
                    if(!filter.test(mobile)){
                        alertMessager('手机号码不正确', 'danger');
                    }else{
                        $(that).addClass('disabled').prop('disabled', true);
                        wait = 30;
                        time(that);
                        $.post(url,{'mobile':mobile, 'title':'密码重置'}).success(function(data){
                            if(data.status == 1){
                                alertMessager(data.info, 'success');
                            }else{
                                alertMessager(data.info, 'danger');
                            }
                        });
                    }
                }
                return false;
            });
        });
    </script>
</block>
